<template>
  <div>
    <el-row class="lock-btn" style='margin-top:10px'>
      
      <el-input v-model="queryParams.userId" style="width:300px;float: left;margin-left:5px;" clearable placeholder="请输入userId"></el-input>

      <el-button-group style="margin-left:5px;">
        <el-button size="medium" type="primary" @click="queryBtn" round>搜索</el-button>
      </el-button-group>
    </el-row>
    <el-row style="background:#ffffff;padding-bottom: 30px;border-radius: 10px;margin-left: 10px;margin-top: 30px;">

      <el-col :span="24">
        <el-form ref="" style="background:#ffffff;padding:20px 0px 0px 0px;border-radius: 10px;margin-top:20px;margin-left: 10px;">
          <el-form-item label="手机号：" :label-width="labelWidth" prop="freeTime">
            <el-input v-model="phone" style="max-width:200px" disabled></el-input>
          </el-form-item>
        </el-form>
      </el-col>

      <el-col :span="24">
        <el-form ref="" style="background:#ffffff;padding:0px 0px 20px 0px;border-radius: 10px;margin-left: 10px;">
          <el-form-item label="余额：" :label-width="labelWidth" prop="freeTime">
            <el-input v-model="amount" style="max-width:200px"></el-input>
          </el-form-item>
        </el-form>
      </el-col>
      <el-col :span="24" style="margin-left: 180px;">
              <el-button size="medium" type="warning" effect="dark" @click="update">修改</el-button>
              <el-button size="medium" type="success" effect="dark" @click="check">校对</el-button>
      </el-col>
    </el-row>


  

      <el-row>
      <el-col :span="24">

        <el-form ref="" v-if="showtag" style="background:#ffffff;padding: 30px 0px 30px 0px;border-radius: 10px;margin-top:20px;margin-left: 10px;">
          <el-row>
          <el-col span="5">
          <el-form-item label="微信支付：" :label-width="labelWidth" prop="freeTime">
            <el-input v-model="WX" style="max-width:200px;min-width:200px;"></el-input>
          </el-form-item>
        </el-col>
        </el-row>
         
        <el-row>
          <el-col span="5">
          <el-form-item label="余额：" :label-width="labelWidth" prop="freeTime">
            <el-input v-model="WALLET" style="max-width:200px;min-width:200px;"></el-input>
          </el-form-item>
        </el-col>
       
        </el-row>
        <el-row>
          <el-col span="5">
          <el-form-item label="退款金额：" :label-width="labelWidth" prop="freeTime">
            <el-input v-model="REFUND" style="max-width:200px;min-width:200px;"></el-input>
          </el-form-item>
        </el-col>
       
        </el-row>
        <el-row>
          <el-col span="5">
          <el-form-item label="消费金额：" :label-width="labelWidth" prop="freeTime">
            <el-input v-model="CONSUME" style="max-width:200px;min-width:200px;"></el-input>
          </el-form-item>
        </el-col>
      
        </el-row>

        <el-row>
          <el-col span="5" style="color:blue">
          <el-form-item label="差额：" :label-width="labelWidth" prop="freeTime">
            <el-input v-model="Difference" style="max-width:200px;min-width:200px;"></el-input>
          </el-form-item>
        </el-col>
      
        </el-row>

        <template>
          <i v-if="checkShow" style="font-size: 100px;position: absolute;top:97px;left:455px;color: green;" class="el-icon-success"></i>
          <i v-if="checkShow2" style="font-size: 100px;position: absolute;top:97px;left:455px;color: red;" class="el-icon-error"></i>
        </template>
        
        </el-form>

       

      </el-col>
     </el-row>   
         

</div>
</template>

<script>
 
import { getNickName, getTestUserName } from "../../util/auth";
import { loadAbnormalOrderApi, procRefundApi,loadLcuserwalletApi,loadAbnormalCheckApi,loadAbnormalUpdateApi } from "../../api/lcredepositrequest.js";
import { loadParkfieldApi } from '../../api/parkfield';

export default {
  name: "lcredepositrequest",
  data: function () {
    return {
      clientHeight:
        Math.max(
          document.documentElement.scrollHeight,
          document.body.scrollHeight
        ) -
        132 -
        5 +
        10 -
        28,
      labelWidth: "130px",
      loading: false,
      WX:'',
      WALLET:'',
      REFUND:'',
      dialogTitle: "",
      pageNo: 1,
      pageSize: 20,
      amount:'',
      phone:'',
      showtag:false,
      checkShow:false,
      checkShow2:false,
      feeForm:{
       
      },
      total: 0,
      multipleSelection: [],
      lcredepositrequests: [],
      form: {
        
      },
      queryParams:{
       
      },
      addDialog:false,
      parkfieldList: [],
      parkfieldId: '',
      status: '',
      Difference:''
    };
  },
  methods: {
    editBtn (index, row) {
      let _this = this;
      _this.$nextTick(()=>{
        if(_this.$refs.form != undefined){
          _this.$refs.form.resetFields();
        }
      });
      //   loadFeedbackApi({pageNo:_this.pageNo,pageSize:_this.pageSize}).then(resp => {
      //   _this.list = resp.data.dataList;
      //   _this.total = resp.data.totalNum
      // });   
      _this.form = row;
      // _this.selectDisable = true;
      _this.addDialog = true;
    },
    update(){
      var _this = this;
      if(_this.queryParams.userId != null && _this.queryParams.userId != undefined){
        _this.showtag = true;
      loadAbnormalUpdateApi({openId:_this.queryParams.userId,amount:_this.amount}).then(resp => {
          _this.check();
       });
      }else{
        alert("请输入用户ID")
      }

    },

    check(){
      var _this = this;
      if(_this.queryParams.userId != null && _this.queryParams.userId != undefined){
        _this.showtag = true;
      loadAbnormalCheckApi({openId:_this.queryParams.userId}).then(resp => {
     _this.WX = resp.data.WX,
     _this.WALLET = resp.data.WALLET,
     _this.REFUND = resp.data.REFUND,
     _this.CONSUME = resp.data.CONSUME;

     let Difference = resp.data.WX - resp.data.WALLET - resp.data.REFUND - resp.data.CONSUME;
     _this.Difference = Difference.toFixed(2)

    //  let NumWX = _this.CONSUME + _this.WALLET + _this.REFUND
    console.log(_this.Difference)
    console.log(-0.1 < Number(_this.Difference))

     if((-0.1 < Number(_this.Difference)) && (Number(_this.Difference) < 0.1)){
      _this.checkShow=true;
      _this.checkShow2=false;
     }else{
      _this.checkShow=false;
      _this.checkShow2=true;
     }


      });
     }else{
    alert("请输入用户ID")
    }
    

    },
    procRefund (index, row, status) {
      let _this = this;
      _this.loading = true;
      procRefundApi(row.id, status).then(resp => {
        console.log(resp)
        _this.loadAbnormalOrder(this.pageNo, this.pageSize);
        _this.$notify({
              title: "成功",
              message: "已处理",
              type: "success"
            });
      });
    },
    handlePageChange (pageSize) {
      this.pageSize = pageSize;
      this.loadAbnormalOrder(this.pageNo, this.pageSize);
    },
    handleNoChange (pageNo) {
      this.pageNo = pageNo;
      this.loadAbnormalOrder(this.pageNo, this.pageSize);
    },
    handleTableChange (val) {
      this.multipleSelection = val;
    },
    loadAbnormalOrder (pageNo, pageSize) {
      let _this = this;
      _this.loading = true;
      loadAbnormalOrderApi({pageNo: pageNo,
        pageSize: pageSize}).then(resp => {
          if (resp.errmsg === "ok") {
            console.log(resp.data.dataList);
            _this.total = resp.data.totalNum;
            _this.list = resp.data.dataList;
  
          }
          setTimeout(() => {
          _this.loading = false;
        }, 1 * 1000);
      });
    },
    loadParkfieldApi () {
      let _this = this;
      _this.loading = true;
      loadParkfieldApi().then(resp => {
        _this.parkfieldList = resp.data.dataList;
        console.log(_this.parkfieldList)
        _this.loading = false;
      });
    },
    queryBtn () {
      let _this = this;

      if(_this.queryParams.userId != null && _this.queryParams.userId != undefined && _this.queryParams.userId != ''){
      loadLcuserwalletApi({openId:_this.queryParams.userId}).then(resp => {   
        _this.amount = resp.data[0],
        _this.phone = resp.data[1]
      });
    }else{
      alert("请输入用户ID")
    }
    }
  },
  computed: {
    userState () {
      return getNickName() === getTestUserName();
    }
  },
  mounted: function () {
    let _this = this;
    this.$nextTick(function () {
      this.loadAbnormalOrder(_this.pageNo, _this.pageSize);
    });
  }
};
</script>

<style scoped>


.page-tool div {
  text-align: right;
}

.lock-btn {
  margin-bottom: 5px;
  margin-top: -10px;
}
.operateBtn {
  font-size: 18px;
  width: 32px;
  height: 32px;
  padding: 0;
}
</style>